<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 讲解Promise
    // Promise解决什么问题？用来封装异步请求，解决回调地狱

    // 回调地狱演示（伪代码）：jQuery中的ajax的回调地狱
    // $.ajax({
    //   url: 'http://ihrm-java.itheima.net/api/one',
    //   // success获取响应数据
    //   success: function (res1) {
    //     // res就是http://ihrm-java.itheima.net/api/one的响应结果
    //     // 需求：第二次的接口请求 需要第一次接口响应的结果当做参数
    //     $.ajax({
    //       url: 'http://ihrm-java.itheima.net/api/two?params=' + res1,
    //       success:function(res2){
    //         // 需求：第三次的接口请求，需要第二次的响应结果当做参数
    //         $.ajax({
    //           url:'http://ihrm-java.itheima.net/api/three?params=' + res2,
    //           success:function(res3){
    //             console.log(res3);
    //           }
    //         })
    //       }
    //     })
    //   }
    // })


    // Promsie 语法
    // Promise有三种状态 pending（异步任务正在执行中） fulfilled（有结果，并且是一个成功的结果） rejected（有结果了，失败的结果）
    // fulfilled 是通过resolve来改变  rejected是通过reject来改变，一旦promise的结果确定，就不会在改变了
    // 当resolve和reject调用的时候，可以传递数据。
    // resolve传递数据可以被Promise实例的then方法中获取到，
    // reject传递数据可以被Promsie实例的catch方法获取到
    // 比如：等我三年，等我挣够100万 就回来娶你

    // const p = new Promise((resolve, reject) => {
    //   setTimeout(() => {
    //     const money = Math.random() * 100 + 50
    //     if (money > 100) {
    //       // console.log('挣够100完了，可以娶了');
    //       // 调用resolve 把承诺改成成功的承诺
    //       resolve('挣够100完了，可以娶了')
    //     } else {
    //       // 调用reject 改成失败的状态
    //       // console.log('找个好人嫁了吧')
    //       // reject传数据的时候 通常传的是一个new Error对象
    //       // reject('找个好人嫁了吧')
    //       reject(new Error('找个好人嫁了吧'))
    //     }
    //   }, 3000);
    // })
    // // console.log(p)
    // p.then(res=>{
    //   console.log(res)
    // }).catch(err =>{
    //   console.log(err);
    // })


    // Promsie可以链式调用
    const p = new Promise((resolve, reject) => {
      setTimeout(() => {
        const money = Math.random() * 100 + 50
        if (money > 100) {
          // console.log('挣够100完了，可以娶了');
          // 调用resolve 把承诺改成成功的承诺
          resolve('挣够100完了，可以娶了')
        } else {
          // 调用reject 改成失败的状态
          // console.log('找个好人嫁了吧')
          // reject传数据的时候 通常传的是一个new Error对象
          // reject('找个好人嫁了吧')
          reject(new Error('找个好人嫁了吧'))
        }
      }, 3000);
    })

    p.then(res => {
      console.log(res);
      // 如果继续.then了 必须上边接着返回成功的promise
      //  Promise.resolve('') 返回一个成功的promise
      //  Promise.reject(new Error()) 返回一个失败的promise
      return Promsie.resolve('123')
    }).then(res => {
      console.log(res)
      return Promise.resolve('456')
    }).then(res => {
      console.log(res)
    })


    // Promise解决回调地狱
    new Promise((resolve, reject) => {
      $.ajax({
        url: 'http://ihrm-java.itheima.net/api/one',
        // success获取响应数据
        success: function (res1) {
          // res就是http://ihrm-java.itheima.net/api/one的响应结果
          // 需求：第二次的接口请求 需要第一次接口响应的结果当做参数
          return Promise.resolve(res1)
        }
      })
    }).then(res2=>{
      $.ajax({
        url: 'http://ihrm-java.itheima.net/api/two?params='+ res2,
        // success获取响应数据
        success: function (res3) {
          // res就是http://ihrm-java.itheima.net/api/one的响应结果
          // 需求：第二次的接口请求 需要第一次接口响应的结果当做参数
          return Promise.resolve(res3)
        }
      })
    }).then(res4=>{
      $.ajax({
        url: 'http://ihrm-java.itheima.net/api/three?params='+ res4,
        // success获取响应数据
        success: function (res5) {
          // res就是http://ihrm-java.itheima.net/api/one的响应结果
          // 需求：第二次的接口请求 需要第一次接口响应的结果当做参数
          return Promise.resolve(res5)
        }
      })
    })

  </script>
</body>

</html>